<template>
	<view class="container">
		<!-- <WarnInfo :image="warnIcon" :title="warnTitle"></WarnInfo> -->
		<view class="common_container">
			<view class="img">
				<image :src="warnIcon" class="icon" mode=""></image>
			</view>
			
			<view>{{warnTitle}}</view>
			
		</view>
		<view class="employ_part">
			<view class="left">
				<view class="left_top_title">
					<view class="name">
					{{ employInfo.title }}
					<view class="distance_address"> &nbsp;&nbsp;{{ employInfo.address }}</view>
					</view>
					<view class="flex_end">
					
					<text style="font-size: 24rpx;">{{ employInfo.publishType }} </text>
					<text class="money_top">￥{{ employInfo.salary }}元 </text>
					<view class="distance" v-if="employInfo.joinNum">已有{{employInfo.joinNum}}人参加</view>
					 </view>
				</view>
				
				
				
				<view class="types">
					<view class="type_item" v-for="(type, i) in employInfo.positionLabel" :key="i">{{ type }}</view>
				</view>
			</view>
			<view class="right">
				<!-- <view class="distance_address">{{ employInfo.title }}</view> -->
				<!-- <view class="money">{{ employInfo.salary }}</view> -->
			</view>
			
		</view>
		<view class="job_require">
			<view class="top_title">
				<view class="title">职位要求</view>
				<image src="../../static/img/jobDetail/tan.png" mode=""></image>
			</view>
			<view class="require_num"><!-- {{employInfo.desc}} --></view>
			<view class="require_num" :class="isOpen ? '' : 'job_detail'">工作内容：{{ employInfo.desc }}</view>
			<view class="open" @click="open">{{ openOrClose }}</view>
		</view>
		<image v-for="(item,i) in employInfo.positionFile" :key="i" v-if="item.type == 'image'" :src="item.url" class="requirement_img" mode="widthFix"></image>
		<video v-for="(item,i) in employInfo.positionFile" :key="i" v-if="item.type == 'video'" class="img_list video_list" :src="item.url" controls @tap.stop=""></video>
		<!-- 地图 -->
		<view class="page-body" style="margin-top: 56rpx;">
			<view class="page-section page-section-gap">
				<map style="width: 100%; height: 269rpx;" :latitude="latitude" :longitude="longitude" :markers="covers">
				</map>
			</view>
		</view>
		<view class="flex_start position_add" @click="goto(1)">
			<image src="../../static/img/orderDetail/position.png" class="position" mode=""></image>
			<view class="position_c">
				<view class="position_num">{{positionNum}}</view>
				<view class="">距您现位置(千米)</view>
			</view>
		</view>
		<Blank></Blank>
		<!-- <view class="group_buying_box"> -->
		<view class="group_buying_box" v-if="employInfo.groupData && employInfo.groupData.length > 0">
			<view class="flex_start group_title">
				<view class="">这些人刚刚开团 可参与拼团</view>
				<view class="get_more" @click="getMore" v-if="employInfo.groupData.length > 3">查看更多>></view>
			</view>
			<view class="flex_start group_title">
				<view class="flex_start img_box">
					<image src="../../static/img/default.png" class="group_default" mode="" v-for="(img, index) in employInfo.groupData" :key="index"></image>
				</view>
				<view class="flex_start group_btns" @click="joinGroup">去参团</view>
			</view>
		</view>
		<Blank></Blank>
		<view class="issue_job_company">
			<view class="title">职位发布人</view>
			<view class="company_name">
				<image :src="employInfo.avatar? employInfo.avatar :'../../static/img/jobDetail/jobPerson.png'" mode="" class="avartar"></image>
				<view class="mid_company">
					<view class="zhiwei">{{ employInfo.nickname }}&nbsp;|总监&nbsp;</view>
					<view class="online">当前在线</view>
				</view>
				<view class="chat_now" @click="createConversationActive(employInfo)">
					<image src="../../static/img/jobDetail/liao.png" mode=""></image>
					<view class="">立即沟通</view>
				</view>
			</view>
		</view>
		<Blank></Blank>
		<view class="company_evaluate" v-if="comment.length > 0">
			<view class="title">公司评价</view>
			<view class="company_evaluate_detail">
				<view class="evaluate_detail_left">
					<image src="../../static/img/jobDetail/issue.png" mode=""></image>
					<view class="name_part">
						<view class="">{{ comment[0].nickname }}</view>
						<view class="">{{ comment[0].desc }}</view>
					</view>
				</view>
				<view class="evaluate_detail_right">{{ comment[0].dateStr }}</view>
			</view>
			<view class="evaluate_detail_content">{{ comment[0].content }}</view>
			<view class="all_evaluate_detail" @click="commentDetail()">查看全部{{ comment.length }}条评价</view>
		</view>
		<view class="company_evaluate" v-else>
			<view class="title">公司评价</view>
			<view class="company_evaluate_detail"></view>
			<view class="all_evaluate_detail">暂无评价，期待评价</view>
		</view>
		<Blank></Blank>
		<view class="report_part">
			<image src="../../static/img/jobDetail/warn.png" mode=""></image>
			<view class="content">未标明收费的职位不会收取任何费用，若商家要求缴 纳费用或押金，请提高警惕并第一时间向我们举报！</view>
		</view>
		<Blank></Blank>
		<view class="other_job">
			<view class="title">其它职位</view>
			<view class="employ_list">
				<view class="employ_part" v-for="(item, index) in employInfo.hot" :key="index">
					<view class="left">
						<view class="name">{{ item.title }}</view>
						<view class="distance_address">{{ item.city }} &nbsp;&nbsp;{{ item.address }}</view>
						<view class="types">
							<view class="type_item" v-for="(type, i) in item.positionLabel" :key="i" v-if="i < 4">{{ type }}</view>
						</view>
						<view class="company_person">
							<image :src="item.avatar || '../../static/img/default.png'" class="default"></image>
							<text>{{ item.nickname }}&nbsp;|&nbsp;招聘者</text>
						</view>
					</view>
					<view class="right">
						<view class="distance_address">{{ item.publishType }}</view>
						<view class="money">￥{{ item.salary }}</view>
						<view class="go_rob" @click="toDetails(item)">我要报名</view>
					</view>
				</view>
			</view>
		</view>
		<view class="fixed_btn">
			<view class="phone_part">
				<image src="../../static/img/jobDetail/phone.png" mode=""></image>
				<view class="" @click="call()">电话</view>
			</view>
			<view class="weixin_part">
				<image src="../../static/img/jobDetail/chat.png" mode=""></image>
				<view class="">微聊</view>
			</view>
			<view class="weixin_part">
				<image src="../../static/img/sn.png" mode="" @click="goCollect(1)" v-if="employInfo.isCollect == 0"></image>
				<image src="../../static/img/myCenter/util3.png" mode="" @click="goCollect(0)" v-else></image>
				<view class="">收藏</view>
			</view>
			<view :class="employInfo.group <1 ? 'third_part flex_all':'third_part'" @click="Joinshow()">
				<view class="money">￥{{ employInfo.salary }}</view>
				<view class="">直接报名</view>
			</view>
			<view class="four_part" v-if="employInfo.group == 1">
				<view class="money">￥{{ employInfo.groupPrice }}</view>
				<view class="" @click="Groupshow()">{{employInfo.groupNumber}}人拼单</view>
			</view>
		</view>
		//合同展示
		<uni-popup ref="isPopup" type="bottom">
			<view class="pop">
				<view class="" v-if="employInfo.contract" style="padding: 20rpx 40rpx;text-indent: 2em;">{{ employInfo.contract.content }}</view>
				<button class="btn" type="default" @click="recruitJoin()">确定</button>
			</view>
		</uni-popup>
		<uni-popup ref="popup_g" type="bottom">
			<view class="pop">
				<view class="" v-if="employInfo.contract" style="padding: 10rpx 40rpx;text-indent: 2em;">{{ employInfo.contract.content }}</view>
				<button class="btn" type="default" @click="recruitGroupHead()">确定</button>
			</view>
		</uni-popup>
	</view>
</template>
<script>
import WarnInfo from '../../components/warnInfo.vue';
import Blank from '../../components/blank.vue';
import uniPopup from '@/components/uni-popup/uni-popup.vue';
import userList from '../../common/tim/tim/commen/tim/user.js'
export default {
	components: {
		WarnInfo,
		Blank,
		uniPopup
	},
	data() {
		return {
			userList: userList,
			friendList:[],
			isActive: 0, //默认聊天记录
			userAddConversationList:[],
			isPopup: false,
			type:'public',
				title: 'map',
				latitude: '',
				longitude: '',
				positionNum: 0,
				covers: [{
						latitude: '',
						longitude: '',
						iconPath: require("../../static/img/orderDetail/starting_point.png")
				}, {
						latitude: '',
						longitude: '',
						iconPath: require("../../static/img/orderDetail/end.png")
				}],
			warnIcon: require('../../static/img/jobDetail/pin.png'),
			warnTitle: '10人拼单活动.可邀请好友或跟路人进行拼单。10人拼单成 功可获得更多的报酬拼单时间为72小时.倒计时58:20:30',
			recruitId: null,
			employInfo: {
				name: '高级文书顾问/笔译',
				title: '英语翻译',
				distance: '8.6km',
				address: '锦江春熙路',
				price: '4k-10k元/月',
				types: ['交通补贴', '周末双休', '五险一金'],
				avtar: '../../static/img/avartor.png',
				anthor: '王女士',
				requireNum: '招聘100人|经验不限|学历不限。可接收应届生',
				jobContent:
					'找工作是我们每个平凡人都会经历的事情.这 过程中可能充满辛酸与苦辣，但是来到我们这里。工作 一天八小时，不上夜班，很少加班，工作环境有空调开找工作是我们每个平凡人都会经历的事情.这 过程中可能充满辛酸与苦辣，但是来到我们这里。工作 一天八小时，不上夜班，很少加班，工作环境有空调开'
			},
			employList: [
				{
					name: '高级文书顾问/笔译',
					title: '英语翻译',
					distance: '8.6km',
					address: '锦江春熙路',
					price: '4k-10k元/月',
					types: ['交通补贴', '周末双休', '五险一金'],
					avtar: '../../static/img/avartor.png',
					anthor: '王女士'
				},
				{
					name: '高级文书顾问/笔译',
					title: '英语翻译',
					distance: '8.6km',
					address: '锦江春熙路',
					price: '4k-10k元/月',
					types: ['交通补贴', '周末双休', '五险一金'],
					avtar: '../../static/img/avartor.png',
					anthor: '王女士'
				}
			],
			isOpen: false,
			openOrClose: '收起',
			CommentList: [],
			comment: [],
			name: '', //公司姓名
			phone: '' //电话
		};
	},
	onLoad(option) {
		let userInfo = uni.getStorageSync('userinfo')
		this.friendList = []
		userList.forEach(item=>{
			console.log(item)
			if(item.userId != userInfo.userId){
				console.log(item)
				this.friendList.push(item)
			}
		})
		this.recruitId = option.id;
		this.type = option.type;
		if (this.type && this.type =='realtime') {
			this.getRealTimeDetail();
		}else{
			this.recruitDetail();
		}
	},
	methods: {
		// updateConversationList(){ //发起聊天
		// // debugger
		// 	// uni.$emit('updateConversationList')
		// 	console.log(this.employInfo)
		// 	uni.navigateTo({
		// 		url: '../../common/tim/tim/pages/tim/room'
		// 	})
		// },
		//选择用户聊天
		createConversationActive(toUserInfo) {
			this.$store.commit('createConversationActive', toUserInfo.uid)
			uni.navigateTo({
				url: '../tim/room'
			})
		},
		getFileType(name) {
		   if(!name) return false;
		   var imgType=["gif", "jpeg", "jpg", "bmp", "png"];
		   var videoType=["avi","wmv","mkv","mp4","mov","rm","3gp","flv","mpg","rmvb"];
		   if(RegExp("\.(" + imgType.join("|") + ")$", "i").test(name.toLowerCase())) {
		      return 'image';
		   } else if(RegExp("\.(" + videoType.join("|") + ")$", "i").test(name.toLowerCase())) {
		      return 'video';
		   } else {
			  return false;
		   }
		},
		toDetails(item){
			if (item.publishType=='实时用工') {
				uni.navigateTo({
					url: '/pages/jobDetail/jobDetail?id='+item.id+'&type=realtime'
				})
			}else {
				uni.navigateTo({
					url: '/pages/jobDetail/jobDetail?id='+item.id+'&type=public'
				})
			}
		},
		joinGroup(){ //参团
			if (this.type == 'public') {
				this.$utils.requert({ url: 'recruitGroupJoin', data: { 
					recruitId: this.recruitId,
					groupId: this.employInfo.groupData[0].groupId
					}, type: 'post' }).then(res => {
					if (res.code === 1) {
						this.$utils.showLayer(res.message);
						this.recruitDetail()
					} else {
						this.$utils.showLayer(res.message);
						this.$refs.popup.close();
					}
				});
			}else if(this.type =='realtime'){ //实时用工
				this.$utils.requert({ url: 'timeOrderGroupJoin', data: { 
					orderId: this.recruitId,
					groupId: this.employInfo.groupData[0].groupId
					}, type: 'post' }).then(res => {
					if (res.code === 1) {
						this.$utils.showLayer(res.message);
						this.getRealTimeDetail()
					} else {
						this.$utils.showLayer(res.message);
						this.$refs.popup.close();
					}
				});
			}
		},
		getMore(){ //查看更多
			uni.setStorageSync('objs',this.employInfo)
			uni.navigateTo({
				url:'/pages/jobDetail/moreList/moreList?type='+this.type
			})
		},
		getDistance(lat1,lng1,lat2,lng2){
			let EARTH_RADIUS = 6378137;
			let distance = 0;
			let startLongitude = lng1;
			let startLatitude = lat1;
			let endLongitude = lng2;
			let endLatitude = lat2;
			let radLatitude1 = startLatitude * Math.PI / 180.0;
			let radLatitude2 = endLatitude * Math.PI / 180.0;
			let a = Math.abs(radLatitude1 - radLatitude2);
			let b = Math.abs(startLongitude * Math.PI / 180.0 - endLongitude * Math.PI / 180.0);
			let s = 2 * Math.asin(Math.sqrt(Math.pow(Math.sin(a / 2), 2)
							+ Math.cos(radLatitude1) * Math.cos(radLatitude2) * Math.pow(Math.sin(b / 2), 2)));
			s = s * EARTH_RADIUS;
			distance = Math.round(s * 10000) / 10000; // 返回距离单位是公里
			console.log('相距公里：'+distance/1000)
			console.log('相距米：'+distance)
			return distance/1000;
		},
		goCollect(type) {
			let _this = this;
			let addtype;
			if (type == 1) {
				addtype = 1;
			} else {
				addtype = 2;
			}
			let data = {
				collectId: this.employInfo.id,
				type: 1,
				add: addtype
			};
			this.$utils.requert({ url: 'collect', data: data, type: 'post' }).then(res => {
				if (res.code === 1) {
					uni.showToast({
						title: '已收藏',
						icon: 'none'
					});
					this.recruitDetail();
				} else {
					this.$utils.showLayer(res.message);
				}
			});
		},
		open() {
			this.isOpen = !this.isOpen;
			this.openOrClose = this.isOpen ? '展开' : '收起';
		},
		getRealTimeDetail(){//获取实时用工详情
			let _this = this
			this.$utils.requert({ url: 'timeOrderDetail', data: { orderId: this.recruitId }, type: 'post' }).then(res => {
				if (res.code === 1) {
					// this.$utils.showLayer(res.message)
					this.employInfo = res.data;
					this.employInfo.positionLabel = this.employInfo.positionLabel.split(',')
					let hot = this.employInfo.hot
					let positionFile = this.employInfo.positionFile
					let picarr = []
					let _this = this
					positionFile.forEach((element) => {
						picarr.push({
							url:element,
							type:_this.getFileType(element)
						})
					})
					this.employInfo.positionFile = picarr
					console.log(this.employInfo.positionFile)
					hot.forEach((e) => {
						e.positionLabel = e.positionLabel.split(',')
					})
					this.employInfo.hot = hot
					// console.log(this.employInfo)
					this.phone = res.data.phone;
					this.latitude = res.data.dimension
					this.longitude = res.data.longitude
					this.covers[0].latitude = res.data.dimension
					this.covers[0].longitude = res.data.longitude
					uni.getLocation({
							type: 'wgs84',
							success: function (res_two) {
								_this.covers[1].latitude = res_two.latitude
								_this.covers[1].longitude = res_two.longitude
								_this.positionNum = (_this.getDistance(res_two.latitude,res_two.longitude,res.data.dimension,res.data.longitude)).toFixed(2)
							}
					});
				} else {
					this.$utils.showLayer(res.message);
				}
			});
		},
		//详情获取
		recruitDetail() {
			let _this = this
			this.$utils.requert({ url: 'recruitDetail', data: { recruitId: this.recruitId }, type: 'post' }).then(res => {
				if (res.code === 1) {
					// this.$utils.showLayer(res.message)
					this.employInfo = res.data;
					let positionFile = this.employInfo.positionFile
					let picarr = []
					let _this = this
					positionFile.forEach((element) => {
						picarr.push({
							url:element,
							type:_this.getFileType(element)
						})
					})
					this.employInfo.positionFile = picarr
					console.log(this.employInfo.positionFile)
					// console.log(this.employInfo)
					this.name = res.data.companyData.name;
					this.phone = res.data.phone;
					this.companyCommentList();
					this.latitude = res.data.dimension
					this.longitude = res.data.longitude
					this.covers[0].latitude = res.data.dimension
					this.covers[0].longitude = res.data.longitude
					uni.getLocation({
					    type: 'wgs84',
					    success: function (res_two) {
								_this.covers[1].latitude = res_two.latitude
								_this.covers[1].longitude = res_two.longitude
								_this.positionNum = (_this.getDistance(res_two.latitude,res_two.longitude,res.data.dimension,res.data.longitude)).toFixed(2)
					    }
					});
				} else {
					this.$utils.showLayer(res.message);
				}
			});
		},
		
		goto(type){
			uni.removeStorageSync('urls')
			let latitude = this.employInfo.dimension 
			let longitude = this.employInfo.longitude 
			let address = this.employInfo.address
			let url = "http://api.map.baidu.com/marker?location="+latitude+","+longitude+"&title="+address+"&content="+address+"&output=html"
			uni.setStorageSync('urls',url)
			uni.navigateTo({
				url:'/pages/fullTimeJob/testNavigation/testNavigation'
			})
		},
		//查看公司评价
		companyCommentList() {
			this.$utils.requert({ url: 'companyCommentList', data: { name: this.name }, type: 'post' }).then(res => {
				if (res.code === 1) {
					// this.$utils.showLayer(res.message)
					this.CommentList = res.data;
					this.comment = res.data.comment;
					// console.log(this.employInfo)
				} else {
					this.$utils.showLayer(res.message);
				}
			});
		},
		//致电
		call() {
			uni.makePhoneCall({
				// 手机号
				phoneNumber: this.phone,
				// 成功回调
				success: res => {
					console.log('调用成功!');
				},
				// 失败回调
				fail: res => {
					console.log('调用失败!');
				}
			});
		},
		//公司评价详情
		commentDetail() {
			uni.navigateTo({
				url: '/pages/companyEvalute/companyEvalute?name=' + this.name
			});
		},
		//直接报名准备
		Joinshow() {
			this.userinfo = uni.getStorageSync('userinfo');
			console.log(this.userinfo);
			let _this = this
			if (_this.userinfo.worker == 0) {
				uni.showToast({
					title: '未进行个人认证，即将跳转至认证页面，认证后即可报名',
					duration: 2000,
					icon: 'none'
				});
				setTimeout(() => {
					uni.navigateTo({
						url: '/pages/selsectIdentity/selsectIdentity'
					});
				}, 2000);
			} else if (_this.userinfo.worker == 1) {
				// this.$refs.isPopup.open();
				_this.recruitJoin()
			} else if (_this.userinfo.worker == -1) {
				uni.showToast({
					title: '您的认证信息还在审核中，请耐心等待',
					duration: 2000,
					icon: 'none'
				});
			}
			// uni.showModal({
			// 	title: '提示',
			// 	content: '报名会从账户中扣除30元的保证金，到公司报道签名后会自动退回到账户！',
			// 	showCancel: true,
			// 	cancelText: '取消报名',
			// 	confirmText: '确定报名',
			// 	success: res => {
			// 		console.log(res)
			// 		if(res.confirm){
			// 		}
			// 	},
			// 	fail: () => {},
			// 	complete: () => {}
			// });
		},
		//拼单准备
		Groupshow() {
			this.userinfo = uni.getStorageSync('userinfo');
			console.log(this.userinfo);
			let _this = this
			if (_this.userinfo.worker == 0) {
				uni.showToast({
					title: '未进行个人认证，即将跳转至认证页面，认证后即可报名',
					duration: 2000,
					icon: 'none'
				});
				setTimeout(() => {
					uni.navigateTo({
						url: '/pages/certification/certification'
					});
				}, 2000);
			} else if (_this.userinfo.worker == 1) {
				// _this.$refs.popup_g.open();
				_this.recruitGroupHead()
			} else if (_this.userinfo.worker == -1) {
				uni.showToast({
					title: '您的认证信息还在审核中，请耐心等待',
					duration: 2000,
					icon: 'none'
				});
			}
			// uni.showModal({
			// 	title: '提示',
			// 	content: '报名会从账户中扣除30元的保证金，到公司报道签名后会自动退回到账户！',
			// 	showCancel: true,
			// 	cancelText: '取消报名',
			// 	confirmText: '确定报名',
			// 	success: res => {
			// 		console.log(res)
			// 		if(res.confirm){
			// 		}
			// 	},
			// 	fail: () => {},
			// 	complete: () => {}
			// });
		},
		//直接报名
		recruitJoin() {
			if (this.type == 'public') {
				this.$utils.requert({ url: 'recruitJoin', data: { recruitId: this.recruitId }, type: 'post' }).then(res => {
					if (res.code === 1) {
						this.$utils.showLayer(res.message);
						this.$refs.popup.close();
						setTimeout(function() {
							uni.switchTab({
								url: '/pages/myCenter/myCenter'
							});
						}, 1000);
					} else {
						this.$utils.showLayer(res.message);
						this.$refs.popup.close();
					}
				});
			}else if(this.type =='realtime'){ //实时用工
				this.$utils.requert({ url: 'timeOrderAccept', data: { orderId: this.recruitId }, type: 'post' }).then(res => {
					if (res.code === 1) {
						this.$utils.showLayer(res.message);
						this.$refs.popup.close();
						setTimeout(function() {
							uni.switchTab({
								url: '/pages/myCenter/myCenter'
							});
						}, 1000);
					} else {
						this.$utils.showLayer(res.message);
						this.$refs.popup.close();
					}
				});
			}
		},
		//组团拼单recruitGroupHead
		recruitGroupHead() {
			let _this = this
			if (this.type == 'public') {
				this.$utils.requert({ url: 'recruitGroupHead', data: { recruitId: this.recruitId }, type: 'post' }).then(res => {
					if (res.code === 1) {
						this.$utils.showLayer(res.message);
						this.$refs.popup_g.close();
						setTimeout(function() {
							uni.navigateTo({
								url: '/pages/groupBuy/groupBuy?type=public&id=' + _this.recruitId
							});
						}, 1000);
					} else {
						this.$utils.showLayer(res.message);
						this.$refs.popup_g.close();
					}
				});
			}else if (this.type == 'realtime'){
				this.$utils.requert({ url: 'timeOrderGroupHead', data: { orderId: this.recruitId }, type: 'post' }).then(res => {
					if (res.code === 1) {
						this.$utils.showLayer(res.message);
						this.$refs.popup_g.close();
						setTimeout(function() {
							uni.navigateTo({
								url: '/pages/groupBuy/groupBuy?type=realtime&id=' + this.recruitId
							});
						}, 1000);
					} else {
						this.$utils.showLayer(res.message);
						this.$refs.popup_g.close();
					}
				});
			}
		}
	}
};
</script>
<style>
page {
	width: 100%;
	height: 100%;
	background-color: #fff;
}
</style>

<style scoped lang="scss">
	.common_container{
		width: 100%;
		background-color: #fffbee;
		padding:36rpx 24rpx;
		font-size: 25rpx;
		color:#FB8408;
		display: flex;
		align-items: center;
		box-sizing: border-box;
		.icon{
			width: 30rpx;
			height: 30rpx;
			margin-right: 10rpx;
		}
	}
	.group_buying_box{
		font-size: 28rpx;
		padding: 30rpx;
		.group_default{
			width: 80rpx;
			height: 80rpx;
			border-radius: 50%;
			margin-left: -30rpx;
			flex-shrink: 0;
			border: 2rpx solid #CCCCCC;
		}
		.img_box{
			box-sizing: border-box;
			margin-left: 30rpx;
		}
		.group_btns{
			border-radius: 8rpx;
			background: red;
			justify-content: center;
			color: white;
			padding: 4rpx 12rpx;
		}
		.group_title{
			justify-content: space-between;
			height: 98rpx;
			.get_more{
				color: #666666;
				font-size: 26rpx;
			}
		}
	}
	
.container {
	width: 100%;
	height: 100%;
}
.position_add{
	justify-content: center;
	margin-top: 30rpx;
	font-size: 24rpx;
	color: #333333;
	margin-bottom: 20rpx;
}
.position{
	width: 50rpx;
	height: 58rpx;
	margin-right: 30rpx;
}
.position_c{
	display: flex;
	justify-content: center;
	align-items: center;
}
.position_num{
	font-size: 38rpx;
	color: #000000;
}
.employ_part {
	padding: 20rpx 0;
	border-bottom: 1rpx solid #f6f6f6;
	display: flex;
	justify-content: space-between;
	position: relative;
	margin: 0 24rpx;
}

.employ_part .name {
	font-size: 31rpx;
	color: #323232;
}
.employ_part .money{
	font-size: 26rpx;
	color: #fb8408;
	margin:30rpx 0;
}
.money_top{
	font-size: 30rpx;
	color: #fb8408;
	margin:10rpx 0;
}
.line{
	height: 30rpx;
	width: 2rpx;
	background:#fb8408;
	margin: 0 30rpx;
}
.distance_address {
	font-size: 24rpx;
	color: #838282;
}

.employ_part .types {
	display: flex;
	margin-bottom: 30rpx;
	margin-top: 30rpx;
	flex-wrap: wrap;
}

.employ_part .types .type_item {
	padding: 0 8rpx;
	border: 1rpx solid #f6f6f6;
	font-size: 25rpx;
	color: #fb8408;
	margin-right: 16rpx;
	flex-shrink: 0;
	margin-bottom: 15rpx;
}
.employ_part .right {
	text-align: right;
	flex-shrink: 0;
}

.employ_part .right .money {
	font-size: 28rpx;
	color: #fb8408;
}
.employ_part .company_person {
	font-size: 24rpx;
	color: #333333;
	display: flex;
	align-items: center;
}
.employ_part .company_person image {
	width: 42rpx;
	height: 42rpx;
	margin-right: 17rpx;
	border-radius: 50%;
}
.employ_part .go_rob {
	width: 137rpx;
	height: 54rpx;
	line-height: 54rpx;
	text-align: center;
	color: #fff;
	background-color: #ffa008;
	font-size: 28rpx;
	border-radius: 7rpx;
	margin-top: 0;
}
.job_require {
	color: #323232;
	margin: 0 24rpx;
	position: relative;
	margin-bottom: 50rpx;
}
.job_require .top_title {
	display: flex;
	margin: 30rpx 0 30rpx 0;
	align-items: center;
}
.job_require .top_title .title {
	font-size: 32rpx;
	margin-right: 10rpx;
}
.job_require .top_title image {
	width: 30rpx;
	height: 30rpx;
}
.job_require .require_num {
	font-size: 28rpx;
}
.job_require .job_detail {
	height: 115rpx;
	overflow-y: hidden;
}
.job_require .open {
	width: 70rpx;
	height: 30rpx;
	background-color: #fff;
	font-size: 28rpx;
	color: #fb8408;
	position: absolute;
	right: 0;
	bottom: 0;
}
.job_address {
}
.job_address .map {
	width: 100%;
	height: 270rpx;
}
.job_address .job_location {
	margin: 33rpx 50rpx;
	font-size: 22rpx;
	color: #838282;
	display: flex;
	align-items: center;
}

.left{
	width: 100%;
}
.job_address .job_location .left {
	display: flex;
	width: 50%;
}
.job_address .job_location .left image {
	width: 50rpx;
	height: 58rpx;
	margin-right: 50rpx;
}
.job_address .job_location .right image {
	width: 50rpx;
	height: 58rpx;
	margin-right: 50rpx;
	border-left: 1rpx solid #f6f6f6;
	padding-left: 50rpx;
}
.job_address .job_location .left .time_part .time {
	font-size: 30rpx;
	color: #333333;
}
.issue_job_company {
	margin: 47rpx 30rpx;
}
.issue_job_company .company_name {
	display: flex;
	align-items: center;
	margin-top: 42rpx;
}
.issue_job_company .title {
	font-size: 32rpx;
	color: #323232;
	padding-bottom: 46rpx;
	border-bottom: 1rpx solid #f6f6f6;
}
.issue_job_company .company_name .avartar {
	width: 105rpx;
	height: 105rpx;
	border-radius: 50%;
	margin-right: 30rpx;
}

.issue_job_company .zhiwei {
	width:300rpx;
	
	font-size: 28rpx;
	color: #323232;
}
.issue_job_company .online {
	font-size: 24rpx;
	color: #838282;
}
.issue_job_company .chat_now {
	font-size: 25rpx;
	color: #fb8408;
	text-align: center;
	margin-left: auto;
}
.issue_job_company .chat_now image {
	width: 42rpx;
	height: 42rpx;
}
.company_evaluate {
	margin: 47rpx 30rpx;
}
.company_evaluate .title {
	font-size: 32rpx;
	color: #323232;
	padding-bottom: 46rpx;
	border-bottom: 1rpx solid #f6f6f6;
}
.company_evaluate_detail {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-top: 44rpx;
}
.company_evaluate_detail .evaluate_detail_left {
	display: flex;
}
.company_evaluate_detail .evaluate_detail_left image {
	width: 58rpx;
	height: 58rpx;
	border-radius: 50%;
	margin-right: 18rpx;
}
.company_evaluate_detail .evaluate_detail_left .name_part view:nth-child(1) {
	font-size: 28rpx;
	color: #323232;
}
.company_evaluate_detail .evaluate_detail_left .name_part view:nth-child(2) {
	font-size: 21rpx;
	color: #838282;
}
.company_evaluate_detail .evaluate_detail_right {
	font-size: 25rpx;
	color: #838282;
}
.evaluate_detail_content {
	font-size: 28rpx;
	color: #333333;
	margin-top: 39rpx;
	margin-bottom: 58rpx;
}
.all_evaluate_detail {
	display: inline-block;
	font-size: 32rpx;
	color: #fb8408;
	border: 1rpx solid #f6f6f6;
	border-radius: 7rpx;
	height: 68rpx;
	line-height: 68rpx;
	text-align: center;
	min-width: 280rpx;
	margin-left: 50%;
	transform: translateX(-50%);
}
.report_part {
	display: flex;
	font-size: 24rpx;
	color: #fb8408;
	padding: 32rpx 40rpx;
	box-sizing: border-box;
}
.report_part image {
	width: 70rpx;
	height: 63rpx;
	margin-right: 30rpx;
}
.report_part .content {
	flex: 1;
	line-height: 36rpx;
}
.other_job {
	margin-bottom: 200rpx;
}
.other_job .title {
	font-size: 32rpx;
	color: #323232;
	padding-bottom: 46rpx;
	border-bottom: 1rpx solid #f6f6f6;
	margin-top: 50rpx;
	margin-left: 30rpx;
	margin-right: 30rpx;
}
.fixed_btn {
	width: 100%;
	height: 112rpx;
	position: fixed;
	bottom: 0;
	left: 0;
	background-color: #fff;
	display: flex;
	border-top: 1rpx solid #f6f6f6;
	text-align: center;
	align-items: center;
}
.fixed_btn .phone_part {
	font-size: 24rpx;
	color: #838282;
	flex: 1;
}
.fixed_btn .phone_part image {
	width: 34rpx;
	height: 34rpx;
}
.fixed_btn .weixin_part {
	font-size: 24rpx;
	color: #838282;
	flex: 1;
}
.fixed_btn .weixin_part image {
	width: 38rpx;
	height: 38rpx;
}
.fixed_btn .third_part {
	width: 240rpx;
	height: 100%;
	font-size: 34rpx;
	color: #fff;
	background: linear-gradient(0deg, #ffc500, #ff9503);
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
}
.fixed_btn .flex_all{
	width: 480rpx;
}
.fixed_btn .third_part .money {
	font-size: 30rpx;
}
.fixed_btn .four_part {
	width: 240rpx;
	height: 100%;
	font-size: 34rpx;
	color: #fff;
	background: linear-gradient(0deg, #ff7701, #ff4a00);
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
}
.fixed_btn .four_part .money {
	font-size: 28rpx;
}
.flex_start{
	display: flex;
	align-items: center;
}
.flex_end{
	display: flex;
	flex-direction: column;
	align-items: center;
}
.pop {
	display: flex;
	flex-direction: column;
	height: 100%;
	width: 100%;
	background-color: #fff;
	justify-content: center;
	font-size: 30rpx;
}
.pop .btn {
	width: 150rpx;
	font-size: 24rpx;
	background-color: #007aff;
	color: #fff;
	margin: 20rpx;
	margin-left: auto;
}
.left_top_title{
	display: flex;
	justify-content: space-between;
	height: 100rpx;
	width: 100%;
}
.requirement_img{
	width: 100%;
	// height: 100%;
	// display: inline;
}
</style>
